<template>
<div class="swiper" style="position: relative; padding-top: 3rem;">
  <div class="hello">
    <van-swipe :autoplay="3000">
    <van-swipe-item v-for="(image, index) in images" :key="index">
    <img v-lazy="image" style="width:100%;height:13rem;"/>
    </van-swipe-item>
    </van-swipe>
  </div>
  <div class="cpshow">
    <div class="show">
      <van-cell-group>
        <van-cell title="店铺学校" />
      </van-cell-group>
      <van-grid :border="false" :column-num="2">
        <van-grid-item v-if="listStatus" v-for="(splist, index) of splists" :key="index" style="padding:2px;background:#e2e2e2;" >
          <div @click="goGoods(splist.shopSchoolId, splist.schoolName)" style="margin-bottom: 12px;">
            <van-image :src="IMG_SERVICE_ADDR + splist.schoolUrl" />
            <div class="show-bottom van-ellipsis" style="color: #ff8400;">
              {{splist.schoolName}}
            </div>
          </div>
        </van-grid-item>
      </van-grid>
    </div>
    <!--<div class="show">-->
      <!--<van-cell-group>-->
        <!--<van-cell title="新款上市" />-->
      <!--</van-cell-group>-->
      <!--<van-grid :border="false" :column-num="2" style="background:#e2e2e2;">-->
        <!--<van-grid-item style="padding:2px;" v-for="(splist, index) of splists" :key="index" >-->
          <!--<router-link to='./goods' style="margin-bottom: 12px;">-->
          <!--<van-image :src="splist.img" />-->
          <!--</router-link>-->
          <!--<div class="show-bottom van-ellipsis" style="color: #ff8400">-->
            <!--{{splist.name}}-->
          <!--</div>-->
        <!--</van-grid-item>-->
      <!--</van-grid>-->
    <!--</div>-->
  </div>

</div>
</template>

<script>
import https from '@/common/https.js'
import {IMG_SERVICE_ADDR} from '@/config/configConstant.js' // 常量参数
export default {
  name: 'shoplnswiper',
  data () {
    return {
      shopId: '',
      IMG_SERVICE_ADDR: IMG_SERVICE_ADDR,
      images: [
        'https://img.yzcdn.cn/vant/apple-1.jpg',
        'https://img.yzcdn.cn/vant/apple-2.jpg'
      ],
      listStatus: false,
      splists: [{
        shopSchoolId: '01',
        schoolUrl: 'https://img.yzcdn.cn/vant/apple-1.jpg',
        schoolName: '一周上六天学的垃圾小学一周上六天学的垃圾小学'
      }]
    }
  },
  created () {
    this.shopId = this.$route.query.shopId
    this.getSchoolList()
  },
  methods: {
    getSchoolList () { // 获取店铺学校列表
      let params = {shopId: this.shopId}
      https.fetchPost('/shop/webs/findWebShopSchoolList', params).then((data) => {
        let schoolList = data.data
        if (schoolList !== null) {
          this.splists = schoolList
          this.listStatus = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    goGoods (shopSchoolId, schoolName) {
      this.$router.push({
        path: '/goods',
        query: {
          shopSchoolId: shopSchoolId,
          schoolName: schoolName
        }
      })
    }
  }
}
</script>

<style scoped>
.img {
    position: relative;
    box-sizing: border-box;
    padding: 4px;
}
.show-bottom{
  width:90%;
  position: absolute;
  bottom: 6px;
}
</style>
